@use 'sass:math';
@use 'sass:color';

@use '_variables' as *;
@use '_mixins' as *;

$form-base-input-width: 340px;

.account-title {
  @include settings-big-title;

  &.account-title-danger {
    color: color.adjust($color: #c54130, $lightness: 10%);
  }
}

input:not([type=submit]) {
  @include peertube-input-text($form-base-input-width);
  display: block;
}

my-input-text {
  @include responsive-width($form-base-input-width);

  display: block;
}

.peertube-select-container {
  @include peertube-select-container($form-base-input-width);
}

my-select-custom-value {
  @include responsive-width($form-base-input-width);

  display: block;
}

input[type=submit],
button {
  @include peertube-button;
  @include orange-button;

  margin-top: 10px;
}

my-user-real-quota-info {
  display: block;
  margin-top: 5px;
  font-size: 11px;
}

.danger-zone {
  button {
    @include peertube-button;
    @include danger-button;
    @include disable-outline;

    display: block;
    margin-top: 0;
  }
}

.breadcrumb {
  @include breadcrumb;
}

.dashboard {
  @include dashboard;
  max-width: 900px;
}
